<!DOCTYPE html>
<html lang="zh-cmn-Hans" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="css/iconfont.css">
    <link rel="stylesheet" href="css/global.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/styles.css">
    <script src="js/jquery.1.12.4.min.js" charset="UTF-8"></script>
    <script src="js/bootstrap.min.js" charset="UTF-8"></script>
    <script src="js/swiper.min.js" charset="UTF-8"></script>
    <script src="js/global.js" charset="UTF-8"></script>
    <script src="js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
    <title>农资商贸销售系统</title>
</head>
<body>
<!-- 顶部tab -->
<div th:replace="~{mall/common :: header}"></div>

<!-- 顶部标题 -->
<div class="bgf5 clearfix">
    <div class="top-user">
        <div class="inner">
            <a style="left: -22px;top: 15px;width: 246px;height: 188px;" class="logo" href="index"><img src="images/icons/logo.png" alt="农资商贸销售系统" class="cover"></a>
            <div class="title">个人中心</div>
        </div>
    </div>
</div>
<div class="content clearfix bgf5">
    <section class="user-center inner clearfix">
        <div class="pull-left bgf">
            <a href="index"><span class="title">农资商城销售系统</span></a>
            <dl class="user-center__nav">
                <dt>帐户信息</dt>
                <a href="userSetting">
                    <dd>个人资料</dd>
                </a>
                <a href="userAddress">
                    <dd>收货地址</dd>
                </a>
                <a href="userUpdatePwd">
                    <dd class="active">修改登录密码</dd>
                </a>
            </dl>
            <dl class="user-center__nav">
                <dt>订单中心</dt>
                <a href="userOrder">
                    <dd>我的订单</dd>
                </a>
            </dl>
        </div>
        <div class="pull-right">
            <div class="user-content__box clearfix bgf">
                <div class="title">账户信息-修改登陆密码</div>
                <div class="step-flow-box">
                    <div class="step-flow__bd">
                        <div class="step-flow__li step-flow__li_done">
                            <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
                            <p class="step-flow__title-top">输入旧密码</p>
                        </div>
                        <div class="step-flow__line step-flow__line_ing">
                            <div class="step-flow__process"></div>
                        </div>
                        <div class="step-flow__li">
                            <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
                            <p class="step-flow__title-top">重置登陆密码</p>
                        </div>
                        <div class="step-flow__line">
                            <div class="step-flow__process"></div>
                        </div>
                        <div class="step-flow__li">
                            <div class="step-flow__state"><i class="iconfont icon-ok"></i></div>
                            <p class="step-flow__title-top">完成</p>
                        </div>
                    </div>
                </div>
                <form class="user-setting__form" role="form">
                    <div class="form-group">
                        <input id="userid" name="userid" th:value="${userinfo.id}" style="display: none;">
                        <input class="form-control" id="oldPassword" name="oldPassword" maxlength="11" autocomplete="off"
                               type="password">
                        <span class="tip-text">请输入原密码</span>
                        <span class="see-pwd pwd-toggle" title="显示密码"><i
                                class="glyphicon glyphicon-eye-open"></i></span>
                        <span class="error_tip"></span>
                    </div>
                    <div class="user-form-group tags-box">
                        <button type="button" class="btn" onclick="submitPwd()">提交</button>
                    </div>
                    <script src="js/login.js"></script>
                    <script>
                        function submitPwd() {
                            //获取输入的密码
                            let oldPassword = $("#oldPassword").val();
                            if (!oldPassword){
                                $('.error_tip').text('请输入原密码');
                            }
                            if (oldPassword) {
                                $.ajax({
                                    url: '/mall/userinfo/yzUserPasswordById',
                                    type: 'get',
                                    data: {
                                        oldPassword: oldPassword,
                                        id: $('#userid').val()
                                    },
                                    success: function (data) {
                                        if (data.code===200) {
                                            $('.error_tip').text('密码验证成功');
                                            window.location.href="/mall/userUpdatePwd2";
                                        } else if (data.code===401){
                                            $('.error_tip').text(data.msg+"，将在三秒后自动跳转到登录页面");
                                            //倒计时三秒跳转到登录页面
                                            setTimeout(function () {
                                                window.location.href="/mall/login";
                                            }, 3000);
                                        }else{
                                            $('.error_tip').text(data.msg);
                                        }
                                    }
                                });
                            }
                        }
                        $(document).ready(function () {
                            $('.form-control').on('blur focus', function () {
                                $(this).addClass('focus');
                                $('.error_tip').empty();
                                if ($(this).val() == '') {
                                    $(this).removeClass('focus')
                                }
                            });
                        });
                    </script>
                </form>
            </div>
        </div>
    </section>
</div>

<!-- 右侧菜单 -->
<div th:replace="~{mall/common :: rightNav}"></div>
<!-- 底部信息 -->
<div th:replace="~{mall/common :: footer}"></div>
<link href="css/cropper/cropper.min.css" rel="stylesheet">
<link href="css/cropper/sitelogo.css" rel="stylesheet">
<script src="js/cropper/cropper.min.js"></script>
<script src="js/cropper/sitelogo.js"></script>


</body>
</html>